<template>
	<view class="wrap">
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">{{title}}</block>
		</cu-custom>
		<u-sticky>
			<view class="search">
				<u-search v-model="keywords" @custom="search" @search="search"></u-search>
			</view>
		</u-sticky>
		<scroll-view class="scroll-list msg-list-item" scroll-y="true">
			<template v-for="(item,index) in mesgList">
				<view :key="index">
					<view class="msg-time">{{item.dateStr}}</view>
					<u-card :title="item.title" :titleColor="item.isRead === 1 ? '':'#1890ff'" :sub-title="item.timeStr"
						:subTitleColor="item.isRead === 1 ? '':'#1890ff'" margin="0rpx 20rpx"
						thumb="/static/msg/list-icon.png"
						@click="navTo('/pages/msg/form?pageType='+pageType+'&info='+item.id)">
						<view class="" slot="body">
							<view class="u-body-item u-flex  u-col-between u-p-t-0">
								<view class="u-body-item-title u-line-2">
									<span v-if="item.isRead===1">{{item.pp}}... </span>
									<a v-else> {{item.pp}}...</a>
								</view>
							</view>
						</view>
						<view class="viewIcon" slot="foot">
							<u-icon name="eye" size="34rpx" :color="item.isRead === 1 ? '':'#1890ff'"
								:label=" item.visits" :labelColor="item.isRead===1 ? '' :'#1890ff'"></u-icon>
							<!-- <u-icon name="thumb-up" size="34rpx" color="" label="7"></u-icon> -->
						</view>
					</u-card>
				</view>


			</template>
			<template v-for="(item,index) in reviewList">
				<view :key="index">
					<view class="msg-time">{{item.dateStr}}</view>
					<u-card :title="getAuditTitle(item.bizType)" titleColor="#1890ff" subTitleColor="#1890ff"
						:sub-title="item.timeStr" margin="0rpx 20rpx" thumb="/static/msg/list-icon.png">
						<view class="" slot="body">
							<view class="u-body-item u-flex  u-col-between u-p-t-0">
								<view class="u-body-item-title ">
									<span>{{item.pp}}</span>
								</view>
							</view>
						</view>
						<view class="viewIcon" slot="foot">

							<u-icon name="eye" size="34rpx" color="#2979ff" labelColor="#2979ff" label="查阅"
								@click="navTo('/pages/msg/form?pageType='+pageType+'&info='+JSON.stringify(item))"></u-icon>

						</view>
					</u-card>
				</view>
			</template>




			<u-divider text="已经到底了"></u-divider>
		</scroll-view>
	</view>
</template>
<script>
	/**
	 * Copyright (c) 2013-Now http://aidex.vip All rights reserved.
	 */
	import {
		getTodoAction,
		getAuditPageTitle,
	} from '../../network/service/addressBook.js'
	export default {
		data() {
			return {
				keywords: '',
				title: '',
				mesgList: [],
				reviewList: [],
				pageType: '',
			};
		},
		onLoad(option) {
			this.pageType = option.pageType
			if (option.pageType === 'notice') {
				this.title = '通知公告'
				this.getNoticeList()
			} else if (option.pageType === 'review') {
				this.title = '审阅消息'
				this.getReviewList()

			} else {
				this.title = ''
			}
		},
		methods: {
			navTo(url) {
				uni.navigateTo({
					url: url
				});
			},
			search(value) {
				this.$u.toast('搜索内容为：' + value)
			},
			/**
			 * 查询通知公告
			 */
			getNoticeList() {
				const userInfo = uni.getStorageSync("userInfo")
				let params = {
					url: '/notice/getNoticeByCondition',
					method: 'POST',
					data: {
						createPerson: userInfo.person,
						roleIds: userInfo.roleIds,
						userRoleIds: userInfo.userRoleIds,
						requestType: "app",

					},
				}
				getTodoAction(params).then(res => {
					res.data.list.map(item => {
						item.pp = item.content && item.content.replace(/<(?:.|\n)*?>/gm, '')
							.replace(/(&rdquo;)/g, '\"')
							.replace(/&ldquo;/g, '\"')
							.replace(/&mdash;/g, '-')
							.replace(/&nbsp;/g, '')
							.replace(/&gt;/g, '>')
							.replace(/&lt;/g, '<')
							.replace(/<[\w\s"':=\/]*/, '') || '';
						item.dateStr = item.createTime.split(' ')[0];
						item.timeStr = item.createTime.split(' ')[1];
					})
					this.mesgList = res.data.list

					this.reviewList = []
				})
			},
			/**
			 * 获取审阅消息
			 */
			getReviewList() {
				const userInfo = uni.getStorageSync("userInfo")
				let params = {
					url: '/message/getUnReadMessageInWork',
					method: 'POST',
					data: {
						type: 0,
						uid: userInfo.uid,
						companyId: userInfo.companyId,
					},
				}
				getTodoAction(params).then(res => {
					this.mesgList = []
					res.data.list.map(item => {
						item.pp = item.title && item.title.replace('[{', '')
							.replace('}]', '');
						item.dateStr = item.createTime.split(' ')[0];
						item.timeStr = item.createTime.split(' ')[1];
					})
					this.reviewList = res.data.list

				})

			},
			getAuditTitle(bizType) {
				return getAuditPageTitle(bizType)
			},

		}
	};
</script>
<style lang="scss" scoped>
	@import '../../common/uni.css';

	page {
		background-color: #f5f5f5;
	}

	.wrap .search {
		background: #ffffff;
	}

	.msg-time {
		font-size: 26rpx;
		padding: 10px 0;
		color: #999999;
		text-align: center;
	}

	.u-card__foot {
		.u-icon {
			margin-right: 10px;
		}
	}

	.u-line-card {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: flex;
	}

	:deep.u-line-1 {
		/* display: flex; */
		overflow: hidden;
		text-overflow: ellipsis;
		word-break: break-all;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical !important;
		white-space: nowrap;
	}

	.u-body-item-title span {
		//color: #1890ff;
		background: linear-gradient(to right, #ec695c, #61c454) no-repeat right bottom;
		background-size: 0 2px;
		transition: background-size 1300ms;
	}

	.u-body-item-title span:hover {
		background-position-x: left;
		background-size: 100% 2px;
	}

	.u-line-2 a {
		color: #1890ff
	}

	.viewIcon {
		float: right;
		cursor: pointer;
		padding: 15rpx;
	}
</style>